<template>
  <ul>
    <li v-for="item in productsStore.all" :key="item.id">
      {{ item.title }} - {{ item.price }} 库存数量X {{ item.inventory }}
      <br />
      <button
        :disabled="!item.inventory"
        @click="cartStore.addProductToCart(item)"
      >
        添加到购物车
      </button>
    </li>
  </ul>
</template>

<script lang="ts" setup>
import { useCartStore } from '../store/cart'
import { useProdunctsStore } from '../store/products'

const productsStore = useProdunctsStore()
const cartStore = useCartStore()

productsStore.loadAllProducts() // 加载所有数据
</script>
